<template>
	<view class="out">
		<view></view>
		<view class="conteng">
		<text class="title">盛和水汇洗浴宾馆</text>
		<view class="describe">		
			<image src="/static/images/5心.svg" class="heart" mode="aspectFit"></image>
			<text class="cord">4.5</text>
			<text class="price">￥39/人|洗浴</text>
		</view>
		<view class="describe01">24h营业</view>	
		<view class="describe02">
			<text class="service01">免费停车</text>
			<text class="service02">可过夜</text>
			<text class="service03">儿童游乐区</text>
		</view>
		</view>
		<view class="conteng01">
			<view class="project01">
				<view class="project01-left">
					<image src="/static/images/盛和水汇.jpg" class="picture" mode="aspectFill"></image>
				</view>
				<view class="project01-right">
					<text class="type">浴咨票</text>
					<view class="describe03">
						<text class="service04">周一到周五可用</text>
						<text class="service05">免预约</text>
						<text class="service06">随时退.过期退</text>
					</view>
					<view class="describe04">
						<text class="price01">￥39</text>
						<button class="but" size="mini">领卷购买</button>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
 
<script>
    export default {
		data() {
			return {
				myObject: {
					spaces: 'initial value'
				}
			}
		}
	}
</script>
<style scoped>
	.out{
		background-color: ghostwhite;
	}
  .conteng{
	  border: 1rpx solid whitesmoke;
	  border-radius: 12rpx;
	  height:130px;
	  background-color: white;
  }
  .title{
	  font-weight: 20rpx;
	  font-size: 70rpx;
  }
  .describe{
	  margin-top: 15rpx;
	  display: flex;	  
  }
  .describe image{
	width: 100px;
	height: 30px;
  }
  .cord{
	  margin-top: 5rpx;
	  margin-left: 10rpx;
	  color: red;
  }
  .price{
	  margin-left: 220rpx;
	  margin-top: 5rpx;
	  color: gainsboro;
  }
  .describe01{
	  color: black;
  }
  .describe02{
	  display: flex;
  }
  .service01{
	  border: 1rpx solid gainsboro;
	  font-size: 30rpx;
  }
  .service02{
  	  border: 1rpx solid gainsboro;
  	  font-size: 30rpx;
	  margin-left:25rpx;
  }
  .service03{
  	  border: 1rpx solid gainsboro;
  	  font-size: 30rpx;
	  margin-left:25rpx;
  }
  .conteng01{
	  height: 800px;
	  margin-top: 30rpx;
	  border: 1rpx solid whitesmoke;
	  border-radius: 20rpx;
	  background-color: white;
  }
  .project01{
	  height: 150px;
	  display: flex;
  }
  .project01-left{
	  width: 40%;
  }
  .picture{
	  width: 90px;
	  height: 90px;
	  border-radius: 15rpx;
  }
  .project01-right{
	  width: 100%;
  }
  .type{
	  font-weight: 400px;
	  margin-left: 15rpx;
  }
  .describe03{
  	  display: flex;
	  color: gray;
  }
  .service04{
  	  border: 1rpx solid gainsboro;
  	  font-size: 30rpx;
	  margin-left:15rpx;
  }
  .service05{
  	  border: 1rpx solid gainsboro;
  	  font-size: 30rpx;
  	  margin-left:15rpx;
  }
  .service06{
  	  border: 1rpx solid gainsboro;
  	  font-size: 30rpx;
  	  margin-left:15rpx;
  }
  .describe04{
	  color: red;
	  margin-top: 35rpx;
  }
  .but{
	  background-color: red;
	  color: white;
	  font-weight: 100;
	  max-height: 28px;
	  margin-left: 100px;
  }
  .price01{
	  margin-top: 5rpx;
  }
</style>
 